import { Component, OnInit, DoCheck } from '@angular/core';
import { TodoItem } from './index';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit, DoCheck {
  ngOnInit() {
    this.updateIsAllChecked();
  }
  ngDoCheck() {
    this.updateIsAllChecked();
  }
  public isAllChecked: boolean = false;

  public todoList: Array<TodoItem> = [];

  public updateIsAllChecked() {
    this.isAllChecked = this.todoList.every((item) => item.isCheck);
  }

  public addTodo(todo: string) {
    this.todoList.push({
      name: todo,
      isCheck: false,
    });
  }
  public removeTodo(todoIndex: number) {
    this.todoList = this.todoList.filter((item, index) => index !== todoIndex);
  }
  public removeCheckedTodo() {
    this.todoList = this.todoList.filter((item) => !item.isCheck);
  }
  public checkAllTodo() {
    this.isAllChecked = !this.isAllChecked;
    this.todoList.forEach((item) => (item.isCheck = this.isAllChecked));
  }
}
